<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <meta name="format-detection" content="telephone=no" />
    <title>服务合约</title>
    <link rel="stylesheet" href="../../css/reset.css" />
    <style>
        body {
            width: 100%;
            background-color: #F8F8F8;
            font-size: 0.26rem;
            height: auto;
            padding-bottom: 0.26rem;
            -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
            font-family: PingFang SC;
            color: #333333;
            padding-bottom: 2.3rem;
        }

        .toDayCoinPrice img {
            width: 0.25rem;
            height: 0.25rem;
            margin-left: 0.11rem;
        }

        .todaypriceDalog {
            width: 4.2rem;
            height: auto;
            background: rgba(255, 217, 64, 1);
            position: absolute;
            top: 0.56rem;
            right: 0.8rem;
            border-radius: 0.08rem;
            font-size: 0.22rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: #595959;
            line-height: 0.44rem;
            padding: 0.2rem 0.15rem;
            z-index: 100;
        }

        .triangleClass {
            position: absolute;
            left: 50%;
            margin-left: -0.05rem;
            top: -0.1rem;
            width: 0;
            height: 0;
            border-bottom: 0.1rem solid #FFD940;
            border-right: 0.1rem solid transparent;
            border-left: 0.1rem solid transparent;
        }

        .serviceDetail {
            width: 100%;
            height: auto;
            background-color: #fff;
            box-sizing: border-box;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
        }

        .serviceDetail>div:first-of-type {
            width: 100%;
            height: 2rem;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
            background: url("../../image/bgdsfx.png") no-repeat center;
            background-size: 100% 100%;
            padding: 0 0.3rem;
            box-sizing: border-box;
        }

        .serviceDetail>div:first-of-type>p:first-of-type {
            width: 100%;
            font-size: 0.32rem;
            font-family: PingFang SC;
            font-weight: bold;
            color: rgba(255, 255, 255, 1);
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: flex-start;
            margin-bottom: 0.16rem;
        }

        .serviceDetail>div:first-of-type>p:nth-of-type(2) {
            width: 100%;
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: bold;
            color: rgba(255, 255, 255, 0.71);
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: flex-start;
            box-sizing: border-box;
        }

        .serviceDetail>div:not(:first-of-type) {
            width: 100%;
            height: auto;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(142, 151, 158, 1);
            padding: 0 0.3rem;
            box-sizing: border-box;
        }

        .serviceDetail>div:not(:first-of-type) span:last-of-type {
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(38, 38, 38, 1);
        }

        .serviceDetail>div:nth-of-type(3) {
            margin-top: 0.21rem;
            margin-bottom: 0.21rem;
        }

        .serviceDetail .rateNum {
            width: 100%;
            height: 0.9rem;
            padding: 0 0.3rem;
            box-sizing: border-box;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            font-size: 0.28rem;
            position: relative;
            margin-bottom: 0.3rem;
        }

        .serviceDetail .rateNum::after {
            display: block;
            width: 6.9rem;
            height: 1px;
            content: "";
            background-color: #eeeeee;
            position: absolute;
            bottom: 0;
            left: 0.3rem;
        }

        .serviceDetail .rateNum b {
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: 520;
        }

        .serviceDetail .rateNum b span:first-of-type {
            color: rgba(142, 151, 158, 1);
            margin-right: 0.66rem;
        }

        #gonextpage {
            width: 100%;
            height: 1.13rem;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
            position: relative;
        }

        #gonextpage::after {
            display: block;
            width: 6.9rem;
            height: 1px;
            content: "";
            background-color: #eeeeee;
            position: absolute;
            bottom: 0;
            left: 0.3rem;
        }


        #gonextpage p {
            width: 100%;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: bold;
            color: rgba(38, 38, 38, 1);
        }

        #gonextpage p>span {
            display: flex;
            display: -webkit-flex;
            align-items: center;
        }

        #gonextpage p:last-of-type {
            justify-content: flex-start;
        }

        #gonextpage .gochooseItem {
            width: 2.4rem;
            height: 0.53rem;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(90deg, rgba(255, 218, 0, 1), rgba(255, 203, 0, 1));
            border-radius: 0.27rem;
            font-size: 0.22rem;
            position: absolute;
            right: 0;
            bottom: -0.2rem;
            z-index: 100;
        }

        .showtext {
            font-size: 0.22rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 1);
            width: 4.14rem;
            height: 0.64rem;
            line-height: 0.64rem;
            text-align: center;
            background: rgba(255, 217, 64, 1);
            position: absolute;
            left: 0.9rem;
            top: -0.8rem;
            border-radius: 0.08rem;
        }

        .showprice {
            width: 100%;
            height: auto;
            background-color: #fff;
            padding: 0.28rem 0.3rem 0 0.3rem;
            box-sizing: border-box;
        }

        .showprice P {
            width: 100%;
            height: auto;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
        }

        .showprice b {
            width: 100%;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: flex-start;
            height: 0.21rem;
            font-size: 0.22rem;
            font-family: PingFang SC;
            font-weight: 400;
            color: rgba(142, 151, 158, 1);
            margin-top: 0.13rem;
        }

        .showprice P span:first-of-type {
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(38, 38, 38, 1);
        }

        .showprice P span:last-of-type {
            font-size: 0.28rem;
            font-family: DIN Medium;
            font-weight: 400;
        }

        .showPaymethod {
            width: 100%;
            padding: 0 0.3rem;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            align-items: flex-start;
            justify-content: center;
            background: #fff;
            box-sizing: border-box;
            padding-bottom: 0.3rem;
        }

        .payWay_Box {
            width: 100%;
            color: #181818;
            box-sizing: border-box;
        }

        .payWay_Box label {
            width: 100%;
            padding: 0 0.3rem 0 0;
            color: #181818;
            box-sizing: border-box;
        }

        .payLogo {
            width: 0.56rem;
            vertical-align: middle;
            margin-right: 0.22rem;
        }

        .payWayTxt {
            display: inline-block;
            width: 0.8rem;
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(38, 38, 38, 1);
        }

        .this_leastM {
            font-size: 0.24rem;
            margin-left: 15%;
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(137, 137, 137, 1);
        }

        input[type=radio] {
            border: 0;
            width: 0.44rem;
            height: 0.44rem;
            position: absolute;
            z-index: 2;
            right: 0;
            top: 50%;
            margin: 0;
            margin-top: -0.22rem;
            opacity: 0
        }

        .radioStyle {
            width: 0.2rem;
            height: 0.2rem;
        }

        .payWay_Box label {
            line-height: 1rem;
            position: relative;
            border-bottom: 0.01rem solid#e2e2e2;
            height: 100%;
            display: block;
            box-sizing: border-box
        }

        .radioStyle {
            width: 0.44rem;
            height: 0.44rem;
            display: inline-block;
            background: #fff;
            border-radius: 50%;
            box-sizing: border-box;
            position: absolute;
            z-index: 1;
            right: 0;
            margin-top: -0.22rem;
            top: 50%;
            border: 0.01rem solid#656565;
        }

        input[type=radio]:checked+.radioStyle {
            border: 0;
            background: url("../../image/checknew.png") center center no-repeat;
            background-size: 100% 100%;
        }

        .payTitle {
            width: 100%;
            height: 0.73rem;
            line-height: 0.73rem;
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(38, 38, 38, 1);
        }

        .contractText {
            width: 100%;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            padding-top: 0.41rem;
            padding-bottom: 0.27rem;
            font-size: 0.28rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(38, 38, 38, 1);
        }

        .contractChoose {
            width: 100%;
            display: flex;
            display: -webkit-flex;
            justify-content: flex-start;
            align-items: center;
        }

        .contractChoose li {
            width: 1.12rem;
            height: 0.5rem;
            background: rgba(255, 255, 255, 1);
            border: 1px solid rgba(229, 229, 229, 1);
            border-radius: 0.08rem;
            font-size: 0.2rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(137, 137, 137, 1);
            line-height: 0.5rem;
            text-align: center;
            margin-right: 0.16rem;
        }

        .contractChoose li {
            background: #fff;
            color: #898989;
            border: 0.015rem solid rgba(229, 229, 229, 1);
        }

        .contractChoose li.selected {
            background: rgba(255, 217, 64, 1);
            color: rgba(38, 38, 38, 1);
            border-color: rgba(255, 217, 64, 1);
        }

        .ruleText {
            width: 100%;
            line-height: 0.44rem;
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(135, 144, 150, 1);
        }

        .spaceWidth {
            display: inline-block;
            width: 0.2rem;
        }

        .InterpretationText {
            width: 100%;
            line-height: 0.44rem;
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(135, 144, 150, 1);
        }

        .scenarioExampleText {
            width: 100%;
            line-height: 0.44rem;
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(135, 144, 150, 1);
        }

        .colortext {
            color: #595959;
        }

        .showChoose {
            width: 100%;
            background-color: #fff;
            padding-left: 0.3rem;
            box-sizing: border-box;
        }

        .showChoose label {
            display: flex;
            display: -webkit-flex;
            align-items: center;
            font-size: 0.23rem;
        }

        .showChoose label span {
            font-family: PingFang SC;
            font-weight: 500;
        }

        input[type="checkbox"]+label::before {
            content: " ";
            display: inline-block;
            width: 0.4rem;
            height: 0.4rem;
            box-sizing: border-box;
            background: url("../../image/iconuwx.png") center center no-repeat;
            background-size: 100% 100%;
            padding: .1rem;
            border-radius: 0.03rem;
            margin-right: 0.1rem;
        }

        input[type="checkbox"]:checked+label::before {
            display: inline-block;
            width: 0.4rem;
            height: 0.4rem;
            box-sizing: border-box;
            background: url("../../image/iconuuaax.png") center center no-repeat;
            background-size: 100% 100%;
            padding: .1rem;
            border: none;
            border-radius: 0.03rem;
            margin-right: 0.1rem;

        }

        input[type="checkbox"] {
            position: absolute;
            clip: rect(0, 0, 0, 0);
        }

        .showclick {
            color: #FAA842;
        }

        .establishButton {
            width: 7.35rem;
            height: 1.25rem;
            background: url("../../image/asdkasdkas.png") no-repeat center;
            background-size: 100% 100%;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: space-between;
            padding-bottom: 0.31rem;
            margin-top: 0.15rem;
        }

        .establishButton p:first-of-type {
            flex: 1;
            height: 100%;
            display: flex;
            display: -webkit-flex;
            flex-direction: column;
            justify-content: center;
            align-items: flex-start;
            padding-left: 0.51rem;
        }

        .establishButton p:first-of-type a {
            color: #ffffff;
            font-size: 0.24rem;
            font-family: PingFang SC;
            font-weight: bold;
            color: rgba(255, 255, 255, 1);
        }

        .establishButton p:first-of-type span {
            font-size: 0.2rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(255, 255, 255, 0.44);
            margin-top: 0.1rem;
        }

        .establishButton p:last-of-type {
            width: 2.3rem;
            height: 100%;
            display: flex;
            display: -webkit-flex;
            justify-content: center;
            align-items: center;
            font-size: 0.28rem;
        }

        .fixedDiv {
            width: 100%;
            background-color: #fff;
            position: fixed;
            bottom: 0;
            left: 0;
            z-index: 10;
            padding-top: 0.3rem;
        }

        .rotate {
            transform-origin: center center;
            transform: rotate(180deg);
            transition: transform 0.2;
        }

        .tipsText {
            width: 100%;
            height: 1rem;
            display: flex;
            display: -webkit-flex;
            align-items: center;
            justify-content: flex-start;
            padding: 0 0.3rem;
            box-sizing: border-box;
            font-size: 0.22rem;
            font-family: PingFang SC;
            font-weight: 500;
            color: rgba(89, 89, 89, 1);
            background-color: #fff;
        }

        .showTipsText::after {
            display: block;
            width: 6.9rem;
            height: 1px;
            content: "";
            background-color: #eeeeee;
            position: absolute;
            bottom: 0;
            left: 0.3rem;
        }

        .showliItem {
            margin-top: 0.2rem;
        }

        .openSlide {
            transform: rotate(180deg);
        }

        #openImg {
            transition: transform 0.2s;
        }

        .showPaymeth {
            width: 100%;
            height: auto;
            padding: 0 0.3rem;
            box-sizing: border-box;
            background-color: #fff;
            margin-top: 0.2rem;
            padding-bottom: 0.6rem;
        }
    </style>
</head>

<body>
    <p class="toDayCoinPrice"
        style="width:100%;height:0.6rem;background:rgba(255,246,226,1);display: flex;display: -webkit-flex;align-items: center;justify-content: flex-start;color: #A18331;font-size: 0.24rem;padding: 0 0.32rem;box-sizing: border-box;position: relative;">
        <span style="height:0.6rem;display: flex;display: -webkit-flex;align-items: center;">
            <span style="margin-right: 0.13rem;">
                实时BTC算力指数:
            </span>
            <span class="showMessge"
                style="display: inline-block;overflow: hidden;white-space: nowrap;text-overflow:ellipsis;">
                -- CNY/T*天
            </span>
        </span>
        <img src="../../image/iconssx.png" class="gth">
        <b class="todaypriceDalog" style="display: none;">
            <span style="font-weight: 600;color: #000;">算力指数=每T算力产币量 *实时币价</span><br>每T算力产币量
            ：取RRM公示的最新每T算力实际产币量(分币比例不计算在内)<br>实时币价：取币安、OKcoin、火币三大交易所均值，10秒更新一次
            <span class="triangleClass">
            </span>
        </b>
    </p>
    <div class="serviceDetail">
        <div>
            <p class="contractName">
                BTC 算力止盈止损合约
            </p>
            <p>
                <img src="../../image/userpng.png" style="width: 0.35rem;height: 0.35rem;margin-right: 0.11rem;">
                合约销售方:<span class="contractCounterparty">BHPay</span>
            </p>
        </div>
        <p class="rateNum">
            <b>
                <span>
                    收益止损率:
                </span>
                <span>
                    90%
                </span>
            </b>
            <b>
                <span>
                    收益止盈率:
                </span>
                <span>
                    200%
                </span>
            </b>
        </p>
        <div>
            <span>
                套保周期
            </span>
            <span>
                90天
            </span>
        </div>
        <div>
            <span>
                生效时间
            </span>
            <span class="effectiveTime">
                0000-00-00 00:00:00
            </span>
        </div>
        <div style="padding-bottom: 0.2rem;border-bottom: 0.16rem solid #f8f8f8;">
            <span>
                结算时间
            </span>
            <span class="settlementTime">
                0000-00-00 00:00:00
            </span>
        </div>
        <div id="gonextpage">
            <p style="position: relative;">
                <span class="showlineBag">
                    <span style="color:rgba(38,38,38,1);font-size: 0.3rem">
                        套保算力包
                    </span>
                    <img src="../../image/iconeekx.png" style="width:0.25rem;height:0.25rem;margin-left:0.11rem;">
                </span>
                <span class="gochooseItem">
                    <span class="maxchooseNum" style="color:rgba(89,89,89,1);font-size: 0.22rem;">
                        未选择算力包
                    </span>
                    <img src="../../image/date_right_jiantoux.png"
                        style="width: 0.07rem;height: 0.14rem;margin-left: 0.1rem;">
                </span>
                <b class="showtext" style="display: none;">
                    只可关联锁定期90天和180天的合约包
                    <span
                        style=" position: absolute;left: 10%;bottom:-0.1rem;width: 0;height: 0;border-top: 0.1rem solid #FFD940;border-right: 0.1rem solid transparent;border-left: 0.1rem solid transparent;">
                    </span>
                </b>
            </p>
            <p
                style="width: auto;font-size:0.22rem;font-family:PingFang SC;font-weight:500;color:rgba(142,151,158,1);line-height:0.3rem;margin-top: 0.1rem;">
                最多可关联：
                <span class="maxRelationnum"
                    style="font-size:0.22rem;font-family:PingFang SC;font-weight:500;color:rgba(142,151,158,1);line-height:0.3rem;">
                    100T
                </span>
                <span style="color: rgba(142,151,158,1)">（到手总算力）</span>
            </p>
        </div>
    </div>
    <p class="tipsText showTipsText"
        style="width: 100%;height: 1.1rem;display: flex;display: -webkit-flex;flex-direction: column;justify-content: center;align-items: flex-start;position: relative;">
        <b
            style="width: 100%;display: flex;display: -webkit-flex;align-items: center;justify-content: space-between;color: #C6935E;font-size: 0.28rem;font-weight: normal;">
            <span>
                预计收益:
            </span>
            <span class="pro">请先选择算力包</span>
        </b>
        <b style="width: auto;font-size: 0.22rem;font-weight: normal;color:rgba(142,151,158,1);margin-top: 0.1rem;">
            关联总到手算力*当前算力指数*合约周期*分币比例
        </b>
    </p>
    <div class="showprice">
        <p>
            <span>
                收益止盈价:
            </span>
            <span class="takeProfitPrice" style="color: #8E979E;">
                --
            </span>
        </p>
        <b>
            套保后收益上限≈预计收益*200%
        </b>
        <p style="margin-top:0.3rem;">
            <span>
                收益止损价:
            </span>
            <span class="stopPrice" style="color: #8E979E;">
                --
            </span>
        </p>
        <b>
            套保后收益下限≈预计收益*90%
        </b>
    </div>
    <!--    <p class="tipsText" style="background-color: #ffffff;margin-bottom: 0.2rem;">
        <img src="../../image/noticexzdsf.png" style="width: 0.25rem;height: 0.25rem;margin-right: 0.1rem;">
        <span>合约费用不计算在内</span>
    </p> -->
    <div class="showPaymethod">
        <p class="contractText" data-show="yes">
            <span>
                服务说明
            </span>
            <img src="../../image/xialax.png" id="openImg" style="width:0.16rem;height:0.08rem;" alt="">
        </p>
        <div class="slideDiv">
            <ul class="contractChoose">
                <li data-value="ruleText" class="selected">
                    服务规则
                </li>
                <li data-value="InterpretationText">
                    名词释义
                </li>
                <li data-value="scenarioExampleText">
                    场景示例
                </li>
            </ul>
            <p class="ruleText showliItem">
                <br>
                1.创建合约时，以实时BTC算力指数、甲方(用户)所指定止盈率/止损率、合约周期、关联算力数额计算止盈价/止损价;<br>
                2.合约期内关联算力所产出的BTC每日发放后即时锁仓，由本智能合约托管;<br>
                3.合约到期结算时，以合约周期内关联算力实际产出BTC数量、实时币价计算结算价;<br>
                <span class="spaceWidth"></span> 3.1若止损价≤结算价≤止盈价，本智能合约将对关联算力所产出BTC解锁;<br>
                <span class="spaceWidth"></span>3.2若结算价＜止损价，本智能合约将代乙方以 <span
                    style="color: #E05C38;">止损价</span>回购关联算力所产生的BTC，回购费用以USDT向甲方支付;<br>
                <span class="spaceWidth"></span>3.3若结算价＞止盈价，本智能合约将代乙方以 <span
                    style="color: #E05C38;">止盈价</span>回购关联算力所产生的BTC，回购费用以USDT向甲方支付;<br>
                4.本合约仅支持90/180天算力合约包，合约有效期内算力包不可进行除续期外的任何操作;<br>
                <br>
            </p>
            <p class="InterpretationText showliItem" style="display: none;">
                <br>
                <span class="colortext">算力指数</span><br>
                算力指数 = 最近一日每T算力出币量*实时币价<br>
                实时币价综合考虑7个头部交易所价格,去掉最高/最低价后取均值<br>
                <br>
                <span class="colortext">止损价/止盈价</span><br>
                止损价 = 下单时所持有总算力*算力指数*合约周期*止损率<br>
                止盈价 = 下单时所持有总算力*算力指数*合约周期*止盈率<br>
                <br>
                <span class="colortext">结算价</span> <br>
                结算价 = 结算时关联算力所产出BTC*实时币价<br>
                <br>
            </p>
            <p class="scenarioExampleText showliItem" style="display: none;"></p>
        </div>
    </div>
    <div class="showPaymeth">
        <p class="payTitle">
            支付方式
        </p>
        <div class="payWay_Box">
            <label for="wallet" id="walletPay">
                <img src="../../image/iconttnex.png" alt="" class="payLogo">
                <span class="payWayTxt">余额</span>
                <span class="this_leastM">可用: <span class="myCnyNum"></span></span>
                <input type="radio" name="payWay" checked value="cny" id="wallet" data-paymethod="RRM_CASH">
                <span class="radioStyle"></span>
            </label>
            <label for="usdt" id="usdtPay" style="border: none;">
                <img src="../../image/usdt.png" alt="" class="payLogo">
                <span class="payWayTxt">USDT</span>
                <span class="this_leastM">可用: <span class="myusdtPrice"></span></span>
                <input type="radio" name="payWay" id="usdt" value="usdt" data-paymethod="RRM_USDT">
                <span class="radioStyle"></span>
            </label>
        </div>
    </div>

    <div class="fixedDiv">
        <div class="showChoose">
            <input type="checkbox" value="checkOtherpay" name="chooseOutcoin" id="checkOtherpay">
            <label for="checkOtherpay">
                我同意
                <span class="showclick">
                    《BTC 算力止盈止损合约服务协议》
                </span>
            </label>
        </div>
        <div class="establishButton">
            <p id="getNeedPrice" data-value="yes">
                <span>
                    <span class="showPriceNew" style="font-size: 0.3rem;color: rgba(255, 112, 73, 1);">--</span>
                    <!--                    <a href="javascript:void(0)" id="hideGetText">重新获取合约费用</a>-->
                    <span class="countdownTime">(<span class="leastTime">50</span>s价格自动刷新)</span>
                </span>
                <span>
                    实时BTC算力指数 <span class="powerNum">0.00000000</span>
                </span>
            </p>
            <p class="createContract">
                创建合约
            </p>
        </div>
    </div>

    <script src="../../script/autosize.js"></script>
    <script src="../../script/jquery_three_two_one.js"></script>
    <script src="../../script/fastclick.js"></script>
    <script src="../../script/app.js"></script>
    <script>
        apiready = function () {
            var app = new APP();
            var account = app.getAccount();
            var getPageId = api.pageParam.id;//保险ID
            var constractId = api.pageParam.constractId;//协议ID
            var isorinPage = api.pageParam.isOrinPage;
            $(".contractName").text(api.pageParam.nameService);
            $(".contractCounterparty").text(api.pageParam.userService);
            $(".effectiveTime").text(app.showdate(1));
            $(".settlementTime").text(app.showdate(91));
            var chooseItem = {
                stopLossRate: "90",//止损率选择
                takeProfitRatio: "200",//止盈率选择
                lockCycle: "90"//锁定周期
            };
            var chooseArr = [];//用户在关联算力包选择的
            var regTwo = /([0-9]+\.[0-9]{2})[0-9]*/;
            var regFour = /([0-9]+\.[0-9]{4})[0-9]*/;
            var sign = "";//获取价格后的签名
            var choosePrice = 0;//获取的费用
            var indexPower = 0;//算力指数
            var totalpower = 0;//用户选择总关联数
            var maxrentNum = 0;//最多关联数量
            //获取用户资产
            var interval = null;
            app.asynchronousAjax("insurance/constract-detail", {
                token: account.token,
                constract_id: constractId,
                insurance_id: getPageId
            }, function (ret) {
                if (ret.code == 200) {
                    $(".showclick").text(ret.data.insurance.name);
                    $(".ruleText").html(ret.data.insurance.chinese_rule_content.replace(/(\r\n|\n|\r)/gm, "</br>"));
                    $(".InterpretationText").html(ret.data.insurance.chinese_example_content.replace(/(\r\n|\n|\r)/gm, "</br>"));
                    $(".scenarioExampleText").html(ret.data.insurance.chinese_weather_content.replace(/(\r\n|\n|\r)/gm, "</br>"));
                    maxrentNum = ret.data.insurance.max_inventory_t;
                    $(".maxRelationnum").text(ret.data.insurance.max_inventory_t + "T");
                    $(".showclick").click(function (params) {
                        var param = {
                            dtype: "dialog391",
                            data: {
                                title: ret.data.insurance.name,
                                orderText: ret.data.body.content,
                                btns: [{
                                    name: "我已阅读并同意",
                                    event: "okRentService"
                                }],
                                extra: {}
                            }
                        };
                        app.dialog(param);
                    })
                } else {
                    app.toast(ret.message);
                }
            })
            function newInterval() {
                clearInterval(interval);
                interval = null;
                var time = 50;
                if (chooseArr.length > 0) {
                    getNeedPay();
                    $(".leastTime").text(time);
                    interval = setInterval(function () {
                        time--;
                        $(".leastTime").text(time);
                        if (time == 0) {
                            clearInterval(interval);
                            interval = null;
                            newInterval();
                        }
                    }, 1000)
                }
            }
            // newInterval();
            function loadPage() {
                app.ajaxPro({
                    url: "insurance/get-user",
                    values: {
                        token: account.token
                    },
                    openFlower: true
                }, function (ret) {
                    if (ret.code == 200) {
                        $(".myCnyNum").text(ret.data.cny);
                        $(".myusdtPrice").text(ret.data.usdt);
                        $(".showMessge").text(ret.data.index + " CNY/T*天");
                        $(".powerNum").text(ret.data.index + "CNY/T*天");
                        var posX = parseInt($(".gth").offset().left);
                        var logwidth = $(".todaypriceDalog").width();
                        var left = posX - logwidth / 2;
                        $(".todaypriceDalog").css({ 'left': left + 'px' });
                    } else {
                        app.toast(ret.message)
                    }
                });
            }
            loadPage();
            $(".gochooseItem").on("click", function () {
                app.openWin({
                    name: "agreement_mclist_headerwin",
                    url: app.hd + "common/headerwin.html",
                    pageParam: {
                        subpage: "rent/agreement_mclist",
                        name: "agreement_mclist",
                        title: "关联算力包"
                    }
                })
            });
            $(".toDayCoinPrice").click(function (e) {
                e.stopPropagation();
                $(".todaypriceDalog").show();
            });
            $(".showlineBag").click(function (e) {
                e.stopPropagation();
                $(".showtext").show();
            });
            $(".stopLossRate span").click(function () {
                $(this).css({ backgroundColor: "#FFD940", color: "#262626" }).siblings().css({ backgroundColor: "#F7F7F7", color: "rgba(142, 151, 158, 1)" });
                chooseItem.stopLossRate = $(this).attr("data-downnumber");
                var thiz = $(this);
                if (chooseArr.length > 0 && !thiz.hasClass('slt')) {
                    getNeedPay();
                    thiz.addClass('slt').siblings('span').removeClass('slt');
                }
            });
            $(".takeProfitRatio span").click(function () {
                $(this).css({ backgroundColor: "#FFD940", color: "#262626" }).siblings().css({ backgroundColor: "#F7F7F7", color: "rgba(142, 151, 158, 1)" });
                chooseItem.takeProfitRatio = $(this).attr("data-upnumber");
                var thiz = $(this);
                if (chooseArr.length > 0 && !thiz.hasClass('slt')) {
                    getNeedPay();
                    thiz.addClass('slt').siblings('span').removeClass('slt');
                }
            });
            $("body").click(function () {
                var thisIsShow = $(".showtext").is(":hidden");
                var thisIsShowNew = $(".todaypriceDalog").is(":hidden");
                if (!thisIsShow) {
                    $(".showtext").hide();
                }
                if (!thisIsShowNew) {
                    $(".todaypriceDalog").hide();
                }
            });
            $(".contractText").click(function () {
                $('#openImg').toggleClass('openSlide');
                $(".slideDiv").slideToggle(50);
            });
            $(".contractChoose li").click(function () {
                $(this).addClass('selected').siblings('li').removeClass('selected');
                var checkLi = $(this).attr("data-value");
                $(".showliItem").hide();
                $("." + checkLi).show();
            });
            function setNull() {
                sign = "";
            }
            $(".payWay_Box input").on("change", function () {
                setNull();
                newInterval();
            });
            var isInterval = null;
            function getNeedPay() {
                getPrice();
            }
            //获取合约费用
            function getPrice() {
                var payMethod = $("input[name='payWay']:checked").val();//获取选择支付方式
                app.ajaxPro({
                    url: "insurance/get-price",
                    values: {
                        token: account.token,
                        high_limit: chooseItem.takeProfitRatio,
                        low_limit: chooseItem.stopLossRate,
                        period: chooseItem.lockCycle,
                        orders: chooseArr.toString(),
                        currency: payMethod
                    },
                    openFlower: true
                }, function (ret) {
                    if (ret.code == 200) {
                        $(".pro").text(ret.data.price.predict_price + payMethod.toUpperCase());
                        $(".takeProfitPrice").text(ret.data.price.win_price + payMethod.toUpperCase()).css("color", "#ED5C1D");
                        $(".stopPrice").text(ret.data.price.lost_price + payMethod.toUpperCase()).css("color", "#ED5C1D");
                        if (payMethod == "usdt") {
                            choosePrice = ret.data.price.final_usdt_price;
                            $(".showPriceNew").text(ret.data.price.final_usdt_price + " USDT");
                            $(".powerNum").text(ret.data.price.index + "USDT/T*天");
                        } else {
                            choosePrice = ret.data.price.final_price;
                            $(".showPriceNew").text(ret.data.price.final_price + " CNY");
                            $(".powerNum").text(ret.data.price.index + "CNY/T*天");
                        }
                        sign = ret.data.sign, indexPower = ret.data.price.index;
                    } else {
                        app.toast(ret.message)
                    }
                });
            }
            var timeoutClick = null;
            $("#getNeedPrice #hideGetText").click(function () {
                var isCheck = $("input[name=payWay]").is(':checked');
                if (!isCheck) {
                    app.toast("请选择支付方式");
                    return
                };
                if (chooseArr.length == 0) {
                    app.toast("请选择关联算力包");
                    return
                }
                if (Number(totalpower) > Number(maxrentNum)) {
                    app.toast("已超过最大关联数");
                    return
                }
                if (timeoutClick == null) {
                    getNeedPay(true);
                    timeoutClick = setTimeout(function () {
                        timeoutClick = null;
                        clearTimeout(timeoutClick);
                    }, 3000)
                } else {
                    app.toast('操作过于频繁')
                }
                // if( isInterval == null ){
                //     getNeedPay(true);
                // }
            });
            var timeout = null;
            $(".createContract").on("click", function () {
                var isCheck = $("input[name=payWay]").is(':checked');
                if (!isCheck) {
                    app.toast("请选择支付方式");
                    return
                };
                var isAregment = $("#checkOtherpay").is(':checked');
                if (!isAregment) {
                    app.toast("请先确定服务协议");
                    return
                };
                var payMethod = $("input[name='payWay']:checked").val();//获取选择支付方式
                if (chooseArr.length == 0) {
                    app.toast("请选择关联算力包");
                    return
                }
                if (Number(totalpower) > Number(maxrentNum)) {
                    app.toast("已超过最大关联数");
                    return
                }
                if (!sign) {
                    app.toast("请先获取合约费用");
                    return
                }
                if (timeout != null) {
                    app.toast('请勿重复提交！');
                    return;
                } else {
                    timeout = setTimeout(function () {
                        clearTimeout(timeout);
                        timeout = null;
                    }, 3000);
                }
                console.log("-----------------" + JSON.stringify(constractId))
                //创建合约
                app.ajaxPro({
                    url: "insurance/order-insurance",
                    values: {
                        token: account.token,
                        sign: sign,
                        insurance_id: getPageId,
                        constract_id: constractId
                    },
                    openFlower: true
                }, function (ret) {
                    if (ret.code == 200) {
                        app.toast("创建成功");
                        setTimeout(function () {
                            app.trigger('loadAg');
                            app.tout(100, function () {
                                app.toMainWin();
                            });
                            app.setStorage("chooseService", {
                                chooseArr: [],
                                totalpower: 0
                            });
                        }, 1000)
                    } else {
                        $("#hideGetText").show();
                        app.toast(ret.message);
                    }
                });
            });

            app.listen("okRentService", function () {
                $("#checkOtherpay").prop('checked', 'true');
            });
            function newListen() {
                app.listen("relatedBagNum", function (ret, err) {
                    chooseArr = ret.value.chooseArr;
                    totalpower = ret.value.totalpower;
                    sign = "";
                    console.log('chooseArr' + JSON.stringify(chooseArr));
                    if (chooseArr.length > 0) {
                        // getNeedPay( true );
                        newInterval();
                        // app.removeListen('relatedBagNum')
                    } else {
                        newListen();
                        setNull();
                    }
                    $(".maxchooseNum").text("已选择" + ret.value.totalpower + "T");
                })
            }
            newListen();
        }
    </script>
</body>

</html>